<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<link rel="shortcut icon" href="../resources/favicon.ico" th:href="@{/static/favicon.ico}"/>
<head>
    <title>Title</title>

</head>
<body>

<div style="width:100%;text-align:center">
    <form th:action="@{'/blog/student/findAll'}">

        <input name="name" class="form-control" onchange="bindName()" id="H_user2" type="text"
               placeholder="请输入用户名..." th:value="${name}"/>

        <input type="submit" value="模糊查询" />
    </form>
    <table border="1" align="center">
        <tr>
            <th>用户ID</th>
            <th>用户姓名</th>
            <th>用户性别</th>
            <th>操作</th>
        </tr>
        <tr th:each="u : ${list}">
            <td th:text="${u.id}"></td>
            <td th:text="${u.name}"></td>
            <td th:text="${u.sex}"></td>
            <td>
                <a th:href="@{/blog/student/perUpdateStudent(id=${u.id})}">修改</a>
                <a th:href="@{/blog/student/deleteStudent(id=${u.id})}">删除</a>
            </td>
        </tr>
        <tr>
            <td>
                <a th:href="@{/blog/student/addStudent}">添加</a>
            </td>
        </tr>
    </table>
    <table border="1" align="center">
        <tr>
            <td><a class="name-bind" href="/blog/student/findAll?pageIndex=0">首页</a></td>
            <td th:if="${pageInfo.getPrePage()} != '0' "><a href="javascript:;" class="name-bind" th:href="${'/blog/student/findAll?pageIndex='+pageInfo.getPrePage()}" >上一页</a> </td>
            <td th:if="${pageInfo.getPrePage()} eq '0' ">上一页</td>
            <td><span th:text="${pageInfo.getPageNum()}" > </span></td>
            <td>/</td>
            <td><span th:text="${pageInfo.getPages()}" > </span></td>
            <td th:if="${pageInfo.getNextPage()} != '0' "><a href="javascript:;" class="name-bind" th:href="${'/blog/student/findAll?pageIndex='+pageInfo.getNextPage()}" >下一页</a></td>
            <td th:if="${pageInfo.getNextPage()} eq '0' ">下一页</td>
            <td><a href="javascript:;" class="name-bind" th:href="${'/blog/student/findAll?pageIndex='+pageInfo.getPages()}">末页</a></td>
            <td>
                <form action="/blog/student/findStudentAll" method="get">
                    <input type="hidden" id="nn" th:value="${pageInfo.getPages()}">
                    跳转到: <input type="text" id="ss" name="num" value="" style="width: 20px">
                    <input type="submit" onclick="f()" value="确定">
                </form>
            </td>
        </tr>
    </table>
</div>
</body>
<script>

    function f() {
        var num = document.getElementById("nn").value;
        var nums = document.getElementById("ss").value;
        if(nums > num || nums< 0){
            alert("无此页，请重新输入");
            document.getElementById("ss").value = "";

        }
    }
    function bindName(){
        var names=document.getElementsByClassName("name-bind");
        var nameLike=document.getElementById("H_user2");
        for (let i=0;i<names.length;i++){
            names[i].setAttribute("href",names[i].attributes["href"].nodeValue.split('&')[0]+"&name="+nameLike.value);
        }
    }
    window.onload=bindName;
</script>
</html>